<template>
	<view class="duilianpt">
		<view v-for="(item, inx) in dataList.meansList" :key="inx">
			<view v-if="[0,1].indexOf(item.isTrue)">
				<u-row justify="space-between" gutter="10">
					<u-col span="12">
						<view class="text-center"><text>{{item.issue}}期：{{item.remarks}}</text></view>
					</u-col>
				</u-row>
						
				<view class="duilianpt centent8" v-if="isShowRow(item.means.xiao,item.is_true,8)">
					<u-row class="element-row" >
						<u-col :span="5" class="element-title" >
							<text class="blue1-text" v-if="item.means.ball && item.means.ball.length">
								八肖:
								<text class="red-text" v-for="(vl,vk) in item.means.xiao" :key="vk">
									<text :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
								</text>
							</text>
						</u-col>
						<u-col :span="7" class="wave-colors">
							<view class="text-left text-left-pd5" v-if="item.means.ball && item.means.ball.length">
								<text class="blue1-text">
									⑧码:
									<text class="red-text" v-for="(vl,vk) in item.means.ball" :key="vk">
										<text :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
										<text v-if="vk<(item.means.ball.length-1)">.</text>
									</text>
								</text>
							</view>
						</u-col>
					</u-row>
					
					<u-row class="element-row" v-if="isShowRow(item.means.xiao,item.is_true,6)">
						<u-col :span="5" class="element-title" >
							<text class="blue1-text" v-if="item.means.ball && item.means.ball.length">
								六肖:
								<text class="red-text" v-for="(vl,vk) in item.means.xiao" :key="vk">
									<text v-if="vk < 6" :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
								</text>
							</text>
						</u-col>
						<u-col :span="7" class="wave-colors">
							<view class="text-left text-left-pd5" v-if="item.means.ball && item.means.ball.length">
								<text class="blue1-text">
									⑥码:
									<text class="red-text" v-for="(vl,vk) in item.means.ball" :key="vk">
										<text v-if="vk < 6" >
											<text :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
											<text v-if="vk<(5)">.</text>
										</text>
									</text>
								</text>
							</view>
						</u-col>
					</u-row>
					
					<u-row class="element-row"  v-if="isShowRow(item.means.xiao,item.is_true,4)">
						<u-col :span="5" class="element-title" >
							<text class="blue1-text" v-if="item.means.ball && item.means.ball.length">
								四肖:
								<text class="red-text" v-for="(vl,vk) in item.means.xiao" :key="vk">
									<text v-if="vk < 4" :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
								</text>
							</text>
						</u-col>
						<u-col :span="7" class="wave-colors">
							<view class="text-left text-left-pd5" v-if="item.means.ball && item.means.ball.length">
								<text class="blue1-text">
									④码:
									<text class="red-text" v-for="(vl,vk) in item.means.ball" :key="vk">
										<text v-if="vk < 4" >
											<text :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
											<text v-if="vk<(3)">.</text>
										</text>
									</text>
								</text>
							</view>
						</u-col>
					</u-row>
					
					<u-row class="element-row"  v-if="isShowRow(item.means.xiao,item.is_true,2)">
						<u-col :span="5" class="element-title" >
							<text class="blue1-text" v-if="item.means.ball && item.means.ball.length">
								二肖:
								<text class="red-text" v-for="(vl,vk) in item.means.xiao" :key="vk">
									<text v-if="vk < 2" :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
								</text>
							</text>
						</u-col>
						<u-col :span="7" class="wave-colors">
							<view class="text-left text-left-pd5" v-if="item.means.ball && item.means.ball.length">
								<text class="blue1-text">
									②码:
									<text class="red-text" v-for="(vl,vk) in item.means.ball" :key="vk">
										<text v-if="vk < 2" >
											<text :class="{'bg-yellow' : (vl.isTrue)}">{{vl.value}}</text>
											<text v-if="vk<(1)">.</text>
										</text>
									</text>
								</text>
							</view>
						</u-col>
					</u-row>
				
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 'JiuXiaoTuiMa',
	props: {
		// 定义一个名为dataList的prop来接收数组数据
		dataList: {
			type: [Object, Array],
			default: () => {
				return {};
			}
		},
		isShowAll: {
			type: [Boolean],
			default: () => {
				return false;
			}
		}
	},
	data() {
		return {};
	},
	mounted() {},
	methods: {
		isShowRow(item,isTrue,nub){
			if(isTrue == 1) {
				var flag = false;
				for(var i=0; i<item.length; i++) {
					if(i < nub) {
						if(item[i].isTrue) {
							flag = true;
							break;
						}
					}
				}
				return flag;
			}else if(isTrue == 2) {
				return false;
			}else{
				return true;
			}
		}
	}
};
</script>

<style lang="scss" scoped>
@import '@/static/css/common.css';
</style>
